import './dialog.scss'
import { el } from '@/utils'

const html = el('dialog', { id: 'log' }, [
  el('div', { className: 'win' }, [
    el('p', {}, ['This is window']),
    el('button', { className: 'dialog-btn' }, ['关闭'])
  ])
])

document.body.appendChild(html._render())

document.body.appendChild(
  el('button', { className: 'btn' }, ['弹框'])._render()
)

const btn = document.querySelector('.btn')!
const dialogBtn = document.querySelector('.dialog-btn')!

const dialog = document.getElementById('log') as HTMLDialogElement

btn.addEventListener('click', () => {
  dialog.showModal()
})

dialogBtn.addEventListener('click', () => {
  dialog.close()
})
